<template>
    <div>

      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="onLoad"
      >
          <van-card
              v-for="item in orderList"
              :key="item.id"
              tag="热卖"
              :price="item.price"
              :origin-price="item.originPrice"
              :desc="item.goodsDesc"
              :title="item.prodName"
              :thumb="item.thumb" 
              @click="detail(item.id)"
          >
              <template #num>
                库存：{{item.num}}
              </template>
              <template #footer>
                  <van-button type="danger" size="mini" @click="addProdToCart(item)">加入购物车</van-button>
              </template>
          </van-card>

      </van-list>
        <van-goods-action>
            <van-goods-action-icon icon="chat-o" text="客服" />
            <van-goods-action-icon icon="shop-o" text="店铺" badge="" />
            <van-goods-action-icon icon="cart-o" text="购物车" :badge="getProdCount" @click="buy" />
            <van-goods-action-button type="danger" text="立即购买" @click="buy" />
        </van-goods-action>
    </div>
</template>

<script>
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";
export default {
    name: "App",
    data() {
        return {
            orderList: [],
            loading: false,
            finished: true
        };
    },
    created() {
        this.$api
            .queryOrder()
            .then((res) => this.orderList = res.data.data)
            .catch((error) => console.log("error", error));
    },
    computed: {
      ...mapState(['cart']),
      ...mapGetters(['getProdCount'])
    },
    mounted() {
      this.loadCartStatus()
    },
    methods: {
      ...mapActions(['addProdToCart', 'loadCartStatus']),
      buy() {
        this.$router.push('order')
      },
      detail(id) {
        this.$router.push({ name:'GoodsDetail', params: { id: id } })
      },
      onLoad() {

      }
    },
};
</script>
<style></style>
